page{
  background: #F9F9F9;
  .canvas{
    position: fixed;
    left: 100%;
    top: 0;
    margin-top: 40rpx;
    margin-left: 44rpx;
    border-radius: 20rpx;
    box-shadow: 0 10rpx 20rpx 4rpx rgba(221, 221, 221, 0.5);
  }
  .share-img{
    width: 660rpx;
    margin-left: 44rpx;
    margin-top: 40rpx;
    border-radius: 20rpx;
    box-shadow: 0 10rpx 20rpx 4rpx rgba(221, 221, 221, 0.5);
  }
  .save-img-btn{
    width: 280rpx;
    height: 70rpx;
    border: none;
    background: #FFCC00;
    font-size: 32rpx;
    line-height:68rpx;
    margin-top: 30rpx;
  }
  .share-wrap{
    padding: 0 54rpx;
    .share-title{
      font-size: 24rpx;
      color: #665C4E;
      margin-top: 50rpx;
      text-align: center;
    }
    .card-wrap{
      width: 100%;
      height: 286rpx;
      margin-top: 40rpx;
      background: #F4ECE1;
      overflow: hidden;
      .title{
        padding: 0 40rpx;
        text-align: center;
        margin-top: 85rpx;
        margin-bottom: 25rpx;
      }
      .desc{
        text-align: center;
        padding: 0 40rpx;
        font-size:28rpx;
        color:#000000;
        line-height: 40rpx;
        word-break: break-all;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp:2;
        overflow: hidden;
        text-overflow:ellipsis;
      }
    }
    .remark{
      margin-top: 65rpx;
      padding-bottom: 65rpx;
      border-bottom: 2rpx dashed #DFDFDF;
      .title{
        font-size: 28rpx;
        margin-bottom: 38rpx;
      }
      .desc{
        text-align: right;
        font-size: 24rpx;
        color: rgba(21, 21, 21, 0.5);
      }
    }
    .nums{
      margin-top: 40rpx;
      display: flex;
      padding-left: 32rpx;
      align-items: center;
      text{
        font-size: 24rpx;
        margin-left: 20rpx;
      }
      .friends{
        margin-right: 24rpx;
        width: 72rpx;
        height: 72rpx;
        border-radius: 100%;
      }
    }
    .btn-wrap{
      display: flex;
      position: fixed;
      left: 0;
      padding-left: 55rpx;
      bottom: 40rpx;
      .share-btn{
        width: 280rpx;
        height: 70rpx;
        line-height: 68rpx;
        box-sizing: border-box;
        border: 2rpx solid #FFCC00;
        border-radius: 10rpx;
        margin-left: 0;
        font-size: 32rpx;
        margin-right: 0;
      }
      .create-img-btn{
        margin-left: 80rpx;
        margin-right: 0;
        width: 280rpx;
        height: 68rpx;
        font-size: 32rpx;
        line-height: 70rpx;
        background: #FFCC00;
        border-radius: 10rpx;
      }
    }
  }
}

